import { Carousel, WingBlank } from 'antd-mobile';
import React from 'react';
import { Button, List } from 'antd-mobile';
import { Flex, WhiteSpace } from 'antd-mobile';
import { Link } from "react-router-dom";

const PlaceHolder = ({ text='Block',className = '', ...restProps }) => (
    <div className={`${className} placeholder`} {...restProps}>{text}</div>
  );

class App extends React.Component {

    constructor(prop){
        super(prop);
        this.state = {
            // data: ['AiyWuByWklrrUDlFignR', 'TekJlZRVCjLFexlOCuWn', 'IJOtIlfsYdTyaDTRVrLI'],
           data: ['2', '1', '3'],

        }
    }
 
  componentDidMount() {
    // simulate img loading
    // setTimeout(() => {
    //   this.setState({
    //     data: ['AiyWuByWklrrUDlFignR', 'TekJlZRVCjLFexlOCuWn', 'IJOtIlfsYdTyaDTRVrLI'],
    //   });
    // }, 100);
  }
  render() {
    return (
      <WingBlank className='main'>
        <Carousel
          autoplay={true}
          infinite={true}
            dots
          >
          {this.state.data.map(val => (
            
              <img
                src={`${val}.png`}
                alt=""
                style={{ width: '100%', verticalAlign: 'top' }}
                onLoad={() => {
                  // fire window resize event to change height
                  window.dispatchEvent(new Event('resize'));
                  this.setState({ imgHeight: 'auto' });
                }}
              />
           
          ))}
        
        </Carousel>

 <div className="sub-title">关于彤程</div>
    <Flex>
      <Flex.Item><PlaceHolder onClick={() =>{window.open('https://www.rachem.com/?about/2.html')}}style={{ background: '#576166'}}text={'公司简介'} /></Flex.Item>
      <Flex.Item><Link to="/fringeBenefits"><PlaceHolder  style={{ background: 'rgb(78, 109, 141)'}}  text={'福利待遇'} /></Link></Flex.Item>
    </Flex>
    <WhiteSpace size="lg" />
    <Flex>
      <Flex.Item><Link to="/job"><PlaceHolder style={{ background: '#b2bcc5'}} text={'校招岗位'} /></Link></Flex.Item>
    </Flex>
    <WhiteSpace size="lg" />
   
       </WingBlank>
    );
  }
}


export default App;